<template>
	<view class="home-page-container" @touchmove.stop.prevent="() => {}">
		<view class="" v-if="falg == true">
			<image class="bgc-imga" src="../../static/images/bg-c.png" mode="widthFix"></image>
			<image class="bgc-img" src="../static/images/home-bgc.png" mode="aspectFit"></image>
			<image class="logo-img" src="../static/images/logo.png"></image>


			<button class="start-btn" @click="handleShowTips">开始邂逅</button>

			<u-popup :show="tipsShow" mode="center" round="12" :safeAreaInsetBottom="false">
				<view class="popup-container">
					<!-- <image class="pop-bgc" :src="img + '/img/home-pop-bg.png'"></image> -->
					<view class="div-popo">
						<view class="pop-title">温馨提示</view>
						<view class="tips-content">
							请您仔细阅读并充分理解相关条款， 点击同意即代表您已阅读并同意
							<view @click="agreementClick" class="agreement-btn">《用户协议》</view>
							、
							<view @click="privacyClick" class="agreement-btn">《隐私政策》</view>
						</view>
						<view class="btn-c">
							<view class="pop-btn agree" @click="handAgree">同意</view>
							<view class="pop-btn" @click="handleNoAgree">不同意</view>
						</view>
					</view>
				</view>
			</u-popup>
		</view>
		<ELM ref="elm" :msg="tipMsg" :isConfirm="isConfirm" @confirm="confirm"></ELM>
		<myPopup v-if="isShow" :content="tipMsgs" @confirm="popupConfirm" @cancel="cancelbtn"></myPopup>
	</view>
</template>
<script>
	var _self;
	import ELM from '@/components/elm-toast/index.vue';
	import myPopup from '@/components/myPopup.vue';
	import {
		wxLogin,
		getUserUserIdAndToken,
		getUserDetail,
		sysDict
	} from '@/common/api.js';
	export default {
		components: {
			ELM,
			myPopup
		},
		data() {
			return {
				tipsShow: false,
				falg: false,
				num: '',
				tipMsg: '',
				isConfirm: false,
				overall: '',
				tipMsgs: '',
				isShow: false
			};
		},
		onShow() {
			this.falg = true;

		},
		onLoad() {
			_self = this;
		},

		methods: {
			overallShowTips() {
				uni.switchTab({
					url: '/pages/tab/index'
				})
			},
			handleShowTips() {
				if (this.vuex_openid) {
					getUserUserIdAndToken({
						openId: this.vuex_openid
					}).then(res => {
						if (res.data) {
							_self.$u.vuex('vuex_userid', res
								.data.userId);
							_self.$u.vuex('vuex_token', res
								.data.token);
							_self.$u.vuex('vuex_openid', res
								.data.openId);
							getUserDetail({
								userId: res.data.userId
							}).then(resss => {
								if ((resss.data.status == '1' && resss.data.isCharge == '1') || (resss.data
										.status == '1' && resss.data.isCharge == '4')) {
									uni.switchTab({
										url: '/pages/tab/index'
									});
								} else if (resss.data.status == '1' && resss.data.isCharge == '2') {
									_self.tipMsgs = '审核不通过，请重新注册';
									this.isShow = true;
								} else if (resss.data.status == '1' && resss.data.isCharge == '3') {
									_self.tipMsg = '您的账号还在审核中';
									_self.$refs.elm.showDialog();
									return;
								} else if (resss.data.status == '2' && resss.data.isCharge == '1') {
									_self.tipsShow = true;
								} else if (resss.data.status == '2' && resss.data.isCharge == '3') {
									_self.tipMsg = '注销审核中';
									_self.$refs.elm.showDialog();
									return;
								} else if (resss.data.status == '3') {
									_self.tipMsg = '您的账号已冻结，请联系工作人员';
									_self.$refs.elm.showDialog();
									return;
								}
							}).catch({

							})
						} else {
							_self.tipsShow = true;
						}

					}).catch({

					})
				} else {
					uni.login({
						provider: 'weixin',
						success: function(loginRes) {
							console.log("loginRes=", loginRes);
							wxLogin({
								code: loginRes.code,
							}).then(ress => {
								getUserUserIdAndToken({
									openId: ress.data.openId
								}).then(res => {
									if (res.data) {
										_self.$u.vuex('vuex_userid', res
											.data.userId);
										_self.$u.vuex('vuex_token', res
											.data.token);
										_self.$u.vuex('vuex_openid', res
											.data.openId);
										getUserDetail({
											userId: res
												.data.userId
										}).then(resss => {
											if ((resss.data.status == '1' && resss.data.isCharge == '1') || (resss.data
													.status == '1' && resss.data.isCharge == '4')) {
												uni.switchTab({
													url: '/pages/tab/index'
												});
											} else if (resss.data.status == '1' && resss.data.isCharge == '2') {
												_self.tipMsgs = '审核不通过，请重新注册';
												_self.isShow = true;
											} else if (resss.data.status == '1' && resss.data.isCharge == '3') {
												_self.tipMsg = '您的账号还在审核中';
												_self.$refs.elm.showDialog();
												return;
											} else if (resss.data.status == '2' && resss.data.isCharge == '1') {
												_self.tipsShow = true;
											} else if (resss.data.status == '2' && resss.data.isCharge == '3') {
												_self.tipMsg = '注销审核中';
												_self.$refs.elm.showDialog();
												return;
											} else if (resss.data.status == '3') {
												_self.tipMsg = '您的账号已冻结，请联系工作人员';
												_self.$refs.elm.showDialog();
												return;
											}
										}).catch({

										})
									} else {
										_self.tipsShow = true;
									}

								}).catch({

								})
							}).catch(() => {

							});
						}
					});
				}

			},
			agreementClick() {
				uni.navigateTo({
					url: '/pagesme/agreement/agreement'
				})
			},
			privacyClick() {
				uni.navigateTo({
					url: '/pagesme/agreement/privacy'
				})
			},
			handleNoAgree() {
				this.tipsShow = false;
			},
			handAgree() {
				this.tipsShow = false;
				uni.navigateTo({
					url: '/pageslogin/index/gender'
				});
			},
			popupConfirm() {
				this.isShow = false
				this.tipsShow = true;
			},
			cancelbtn() {
				this.isShow = false
			},
		}
	};
</script>

<style lang="scss">
	page {
		height: 100%;
	}

	.home-page-container {
		position: relative;
		text-align: center;
		width: 100vw;
		height: 100%;

		.pop-bgc {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			// z-index: -1;
		}

		.popup-container {
			height: 562rpx;
			width: 544rpx;
			overflow: hidden;

			.div-popo {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;

				.pop-title {
					color: rgba(45, 49, 50, 0.8);
					font-weight: 400;
					font-size: 40rpx;
					margin-top: 78rpx;
					font-family: 'PingFang SC-Heavy, PingFang SC';
				}

				.tips-content {
					width: 448rpx;
					margin: auto;
					text-align: left;
					margin-top: 50rpx;
					line-height: 56rpx;
					color: #666;
					font-size: 28rpx;
					font-family: 'PingFang SC-Regular, PingFang SC';

					.agreement-btn {
						display: inline-block;
						color: #5b83e8;
						font-family: 'PingFang SC-Bold, PingFang SC';
						text-decoration: underline;
					}
				}

				.btn-c {
					display: flex;
					margin: auto;
					margin-top: 64rpx;
					justify-content: space-between;
					width: 428rpx;
				}
			}

			.pop-btn {
				width: 204rpx;
				height: 76rpx;
				border-radius: 38rpx;
				text-align: center;
				line-height: 76rpx;
				border: 2rpx solid #446cd2;
				color: #5b83e8;
				font-family: 'PingFang SC-Regular, PingFang SC';

				&.agree {
					border: none;
					background: linear-gradient(86deg, #c2d2f9 0%, #c5c2f3 100%);
				}
			}
		}

		.logo-img {
			width: 200rpx;
			height: 200rpx;
			margin-top: 90vw;
		}

		.start-btn {
			width: 536rpx;
			height: 84rpx;
			background: linear-gradient(86deg, #c2d2f9 0%, #c5c2f3 100%);
			margin: auto;
			border-radius: 42rpx 42rpx 42rpx 42rpx;
			line-height: 84rpx;
			color: rgba(65, 92, 158, 0.8);
			font-weight: 400;
			font-size: 28rpx;
			position: fixed;
			bottom: 15vh;
			left: 112rpx;

			font-family: 'PingFang SC-Bold, PingFang SC';
		}
	}

	.bgc-img {
		position: absolute;
		top: -80rpx;
		left: 40rpx;
		width: 670rpx;
		pointer-events: none;
		height: 100%;
	}

	.bgc-imga {
		position: absolute;
		top: -100rpx;
		left: 0rpx;
		width: 100%;
		pointer-events: none;
		height: 100%;
	}
</style>